#demo, .demo, .content .demo
  border: 1px solid #eee
  border-radius: $radius
  padding: 25px 35px
  margin-top: 1em
  margin-bottom: 40px
  -webkit-user-select: none
  -moz-user-select: none
  -ms-user-select: none
  user-select: none
  overflow-x: auto
  h1
    margin: 0 0 .5em
    font-size: 1.8em
  h2
    padding: 0
    border: none
  h2, h3, h4, h5, h6
    margin: 1em 0
  ul, ol
    padding-left: 1.5em
    padding-bottom: .2em !important
    &:first-child
      margin-top: 0
    &:last-child
      margin-bottom: 0
  li
    color: $medium
    // !!TODO: Check to make sure this isn't here for a good reason.
    // cursor: pointer
    // -ms-user-select: none
    // -moz-user-select: none
    // -webkit-user-select: none
    &.done
      color: $light
      text-decoration: line-through
  p
    margin: 0 !important
    padding: 0 !important
  textarea
    width: 100%
    resize: vertical
  > :first-child
    margin-top: 0
  > :last-child
    margin-bottom: 0



ul#demo, ul.demo
  li
    margin-left: 1.5em

@media screen and (max-width: 900px)
  #demo, .demo
    margin-left: 0

.benchmark-table
  margin: 0 auto
  text-align: center

  tbody > tr > th
    text-align: right

  th, td
    padding: 3px 7px

@media print
  #demo, .demo, .content .demo
    page-break-inside: avoid
    padding: 1em
    margin-bottom: 1em
    border-width: 2px
